// 底部备案链接
<template>
  <div class="footer-link">
    <header>
      <div class="left">
        <h1>400-900-9050</h1>
        <p>
          <i></i>上午8:00~12:00 下午14:00~17:45
        </p>
        <p>（周一至周六，节假日除外）</p>
        <p>
          <i></i> service@honghaoinfo.com
        </p>
      </div>
      <div class="right">
        <ul>
          <li>资源</li>
          <li>
            <router-link to="/">知识库</router-link>
          </li>
          <li>
            <router-link to="/">技术论坛</router-link>
          </li>
          <li>
            <router-link to="/">新闻资讯</router-link>
          </li>
        </ul>

        <ul>
          <li>帮助</li>
          <li>
            <router-link to="/">新手指引</router-link>
          </li>
          <li>
            <router-link to="/">常见问题</router-link>
          </li>
          <li>
            <router-link to="/">意见反馈</router-link>
          </li>
        </ul>

        <ul>
          <li>支持</li>
          <li>
            <router-link to="/">注册协议</router-link>
          </li>
          <li>
            <router-link to="/">隐私条款</router-link>
          </li>
          <li>
            <router-link to="/">企业认证申请表</router-link>
          </li>
        </ul>

        <ul>
          <li>关于</li>
          <li>
            <router-link to="/">关于我们</router-link>
          </li>
          <li>
            <router-link to="/">联系我们</router-link>
          </li>
          <li>
            <router-link to="/">加入我们</router-link>
          </li>
        </ul>
      </div>
      <!-- 二维码 -->
      <div class="code">
        <img src="@/assets/img/二维码.png" alt />
        <p>加微信，查订单</p>
      </div>
    </header>
    <!-- 底部备案号 -->
    <footer>Copyright © 2010-2019 鸿浩电梯 版权所有 粤ICP备14032684号-2</footer>
  </div>
</template>
<script>
export default {
  name: "FooterLink"
};
</script>
<style lang='scss' scoped>
.footer-link {
  height: 313px;
  background-color: #e8e8e8;
  width: 100%;
  header {
    height: 275px;
    overflow: hidden;
    .left {
      float: left;
      margin-top: 53px;
      margin-left: 200px;
      height: 100%;
      width: 220px;
      p {
        position: relative;
        color: #9b9b9b;
        margin-top: 17px;
        i {
          position: absolute;
          left: -20px;
          display: block;
          width: 14px;
          height: 14px;
        }
        &:nth-child(2) {
          i {
            top: 9px;
            background: url("~@/assets/img/时间.png") no-repeat center;
            background-size: 100%;
          }
        }
        &:nth-child(4) {
          i {
            top: 3px;
            background: url("~@/assets/img/邮箱.png") no-repeat center;
            background-size: 100%;
          }
        }
        &:nth-child(3) {
          margin-top: 5px;
        }
      }
    }
    .right {
      margin-top: 60px;
      float: left;
      ul {
        float: left;
        margin-left: 60px;
        height: 100%;
        width: 100px;
        li {
          margin-top: 10px;
          &:first-child {
            margin-top: 0;
            font-size: 16px;
            color: #666666;
            font-weight: 800;
          }
          &:nth-child(2) {
            margin-top: 24px;
          }
          a {
            font-size: 14px;
            color: #9b9b9b;
          }
        }
      }
    }
    .code {
     margin-top: 60px;
     margin-left: 96px;
     float: left;
      width: 134px;
      height: 160px;
      background-color: #fff;
      text-align: center;
      img {
        margin-top: 16px;
        height: 101px;
        width: 101px;
      }
      p {
        margin-top: 10px;
      }
    }
  }
  footer {
    background-color: #4a4a4a;
    padding-left: 194px;
    box-sizing: border-box;
    height: 38px;
    line-height: 38px;
    color: #9b9b9b;
  }
}
</style>